<template>
	<view class="">
		<!-- <web-view v-if="url" :src="url"></web-view> -->
		<view class="box">{{info.name}}</view>
		<ezplayer 
		     v-if="info"
		    id="ezplayer"
		    :accessToken="info.token"
		    :url="'rtmp://open.ys7.com/'+info.serial+'/'+info.no+'/live'"
		    plugins="talk"
		    recPlayTime=""
		    height="240"
		    bind:handleError="handleError"
		/>
		
		<view class="btn_box">
		
			<view v-if="show" class="left_btn btn mr" @click="set(1)">接听</view>
			<view class="right_btn btn mr" @click="set(2)">挂断</view>
			<view class="blue_btn btn" @click="setOpen()">开锁</view>
		</view>
		
	</view>
</template>

<script>
	export default{
		data(){
			return{
				id:'',
				url:'',
				info:'',
				show:true
			}
		},
		onLoad(e) {
			if(e.id){
				this.url='https://dingdong.jxyuanli.com/web//#/?id='+e.id;
				console.log(this.url);
				this.id=e.id;
			}
			
			this.getInfo();
		},
		methods:{
			set(type){
				this.$post(this.$api.hksetInfo,{id:this.info.hkdj_id,type:type},res=>{
					  let {code,data,msg}=res.data;
					  if(code==1){
						  uni.showToast({
						  	title: msg,
						  	icon: 'none'
						  })
						  
						  if(type==1){
							  this.show=false;
						  }
						  
						  if(type==2){
							  uni.navigateBack();
						  }
						  
					  }
				});
			},
			setOpen(){
				
				this.$post(this.$api.hkopen,{id:this.info.id},res=>{
					
					let {code,data,msg}=res.data;
					if(code==1){
						uni.showToast({
							title: msg,
							icon: 'none'
						})
					}
					
				});
			},
			handleError(e){
			   console.log(e);	
			},
			getInfo(){
				this.$get(this.$api.hkgetInfo,{id:this.id},res=>{
					let {code,data}=res.data;
					if(code==1){
						this.info=data;
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.box{
		box-sizing: border-box;
		padding: 20rpx 0;
	}
	
	.btn_box{
			display: flex;
			align-items:center;
			justify-content: center;
			box-sizing: border-box;
			padding: 20rpx 0;
		}
		.btn{
			color: white;
			text-align: center;
			border-radius: 15rpx;
			width:25%;
			box-sizing: border-box;
			padding:15rpx 0rpx;
		}
		
		.mr{
			margin-right: 15rpx;
		}
		
	    .left_btn{
			
			background-color: #F85045;
			
			
		}
		.right_btn{
			background-color: #2F3F3E;
		}
		.blue_btn{
			background-color: #25B0F3;
		}
		.img{
			width: 50rpx;
			margin-right: 10rpx;
		}
</style>